<template>
    <el-card>
        <el-row :gutter="5">
            <el-col :md="{span:8}" :sm="{span: 12}">
                <el-input
                        v-model="search.content"
                        placeholder="请输入搜索内容"
                        class="search-doctor-input"
                >
                    <template #append>
                        <el-button style="width: 100px" @click="LoadWarehouseDatas(1)">
                            <el-icon>
                                <i class="fas fa-search" />
                            </el-icon>
                            搜索
                        </el-button>
                    </template>
                </el-input>
            </el-col>
            <el-col :md="{span:4}" :sm="{span:4}">
                <el-button type="primary" plain @click="dialog.isShowAddUser=true">
                    <el-icon>
                        <i class="fas fa-plus" />
                    </el-icon>
                    添加
                </el-button>
            </el-col>
        </el-row>
    </el-card>
    <el-card style="margin-top: 10px">

        <el-table :data="warehouseDatas" style="width: 100%" v-loading="loading" @cell-dblclick="cellClick">
            <el-table-column prop="drugsId" label="药品ID" />
            <el-table-column prop="drugsName" label="药品名称"  />
            <el-table-column prop="drugsContent" label="药效描述"  />
            <el-table-column prop="drugsCom" label="生产厂家"  />
            <el-table-column prop="drugsAddress" label="生产地址"  />
            <el-table-column prop="drugsPrice" label="价格"  >
                <template #default="scope">
                    <el-input-number style="width: 100%" :min="0" v-model="scope.row.drugsPrice" @change="changePrice(scope.row)" />
                </template>
            </el-table-column>
            <el-table-column  label="库存" >
                <template #default="scope">
                    <el-input-number style="width: 100%" :min="0" v-model="scope.row.drugsCount" @change="changeCount(scope.row)"/>
                </template>
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="120">
                <template #default="scope">
                    <el-button type="danger" @click="deleteUser(scope.row)">
                        <el-icon>
                            <i class="fas fa-trash-alt" />
                        </el-icon>
                        删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
    </el-card>
    <el-card style="margin-top: 10px">
        <el-pagination style="text-align: center" layout="prev, pager, next" :page-size="pageInation.pageSize" :page-count="pageInation.pageCount" @current-change="LoadWarehouseDatas" small></el-pagination>
    </el-card>
    <el-dialog
            v-model="dialog.isShowAddUser"
            title="添加药品"
            width="30%"
            destroy-on-close
            center
    >
        <SystemPopupAddDrugs />
    </el-dialog>
</template>

<script>
    import utils from "@/Utils";
    import SystemPopupAddDrugs from "@/components/SystemAdmin/Popup/SystemPopupAddDrugs";
    export default {
        name: "SystemAdminWarehouse",
        components:{
            SystemPopupAddDrugs
        },
        data(){
            return{
                search:{
                    content:''
                },
                warehouseDatas:[],
                pageInation:{
                    pageCount:0,
                    pageSize:0,
                },
                loading:true,
                dialog:{
                    isShowAddUser:false
                },
                utils
            }
        },
        methods:{
            LoadWarehouseDatas:async function (pageIndex) {
                this.loading=true;
                const search=this.search.content;
                console.log(search)
                await this.axios.post("/Drugs/isLogin/getDrugs",{
                    pageIndex:pageIndex,
                    pageSize:10,
                    search:search
                }).then((req)=>{
                    const data=req.data;
                    if(data.code>0){
                        this.utils.tipsMessage(data.error,data.code);
                        return
                    }
                    const pageData=data.data.pageData;
                    this.pageInation.pageSize=data.data.pageSize;
                    this.pageInation.pageCount=data.data.pageCount;
                    this.warehouseDatas=pageData;
                    this.loading=false
                })
            },
            cellClick:function (row, column) {
                if(column.property==='drugsId'||column.property==='drugsCount'||column.property==='drugsPrice'||column.property===undefined) return;
                console.log(column.property)
                this.$prompt("请确认是否需要修改:"+column.label,"修改内容",{
                    showCancelButton:false,
                    inputValue:row[column.property]
                }).then((val)=>{
                    if (this.utils.isRange(30, 1, val.value)) {
                        this.utils.tipsMessage("真实姓名需要输入2~30位");
                        return;
                    }
                    const drugsName=column.property==='drugsName'?val.value:'';
                    const drugsContent=column.property==='drugsContent'?val.value:'';
                    const drugsCom=column.property==='drugsCom'?val.value:'';
                    const drugsAddress=column.property==='drugsAddress'?val.value:'';
                    this.axios.post("/Drugs/isLogin/isSystemAndDrugs/updateDrugsByDrugsId",{
                        drugsId:row.drugsId,
                        drugsName:drugsName,
                        drugsContent:drugsContent,
                        drugsCom:drugsCom,
                        drugsAddress:drugsAddress,
                    }).then((req)=>{
                        const data=req.data;
                        if(data.code>0){
                            this.utils.tipsMessage(data.error,data.code);
                            return;
                        }
                        this.utils.tipsMessage(data.data,data.code);
                        row[column.property]=val.value;
                    })
                })
            },
            deleteUser:function (val) {
            this.$confirm("请确认是否需要删除药品:"+val.drugsName, "删除药品", {
                type:'type',
                showCancelButton:false
            }).then(()=>{
                this.axios.post("/Drugs/isLogin/isSystemAndDrugs/deleteDrugsByDrugsId",{
                    drugsId:val.drugsId
                }).then((req)=>{
                    const data=req.data;
                    if(data.code>0){
                        this.utils.tipsMessage(data.error,data.code);
                        return;
                    }
                    this.utils.tipsMessage(data.data,data.code);
                    this.LoadWarehouseDatas(1);
                })
            })
        },
            changePrice:function (val) {
                this.axios.post("/Drugs/isLogin/isSystemAndDrugs/updateDrugsByDrugsId",{
                    drugsId:val.drugsId,
                    drugsPrice:val.drugsPrice,
                }).then((req)=>{
                    const data=req.data;
                    if(data.code>0){
                        this.utils.tipsMessage(data.error,data.code);
                        return;
                    }
                    this.utils.tipsMessage(data.data,data.code);
                })
            },
            changeCount:function (val) {
                this.axios.post("/Drugs/isLogin/isSystemAndDrugs/updateDrugsByDrugsId",{
                    drugsId:val.drugsId,
                    drugsCount:val.drugsCount,
                }).then((req)=>{
                    const data=req.data;
                    if(data.code>0){
                        this.utils.tipsMessage(data.error,data.code);
                        return;
                    }
                    this.utils.tipsMessage(data.data,data.code);
                })
            }
        },
        mounted(){
            this.LoadWarehouseDatas(1);
        }
    }
</script>

<style scoped>
    .search-doctor-input /deep/ .el-input-group__prepend,.search-doctor-input /deep/ .el-input-group__append {
        background-color: #fff;
    }
</style>